﻿var mapEngineLoaded = true;
var map = null;

var MyOverlay = Class.create({
    name: "MyOverlay"
    , extend: BMap.Overlay
    , construct: function (html, lng, lat, map) {

        this._html = html;
        var tempDiv = $("<a style='left:9999px;padding:2px;font-size:12px;border:1px solid;line-height:18px;' ></a>");
        tempDiv.html(html).appendTo("body");
        this._width = tempDiv.width(); 
        this._height = tempDiv.height();
        tempDiv.remove();
        this._point = new BMap.Point(lng, lat);
        map.addOverlay(this);
    }
    , methods: {
        initialize: function (map) {
            this._map = map;
            var div = this._div = document.createElement("div");
            div.style.position = "absolute";
            div.style.zIndex = BMap.Overlay.getZIndex(this._point.lat);
            div.style.backgroundColor = "#EE5D5B";
            div.style.border = "1px solid #BC3B3A";
            div.style.color = "white";
            div.style.width = this._width + "px";
            div.style.height = this._height + "px";
            div.style.padding = "2px";
            div.style.lineHeight = "18px";
            div.style.whiteSpace = "nowrap";
            div.style.MozUserSelect = "none";
            div.style.fontSize = "12px"
            $(div).html(this._html);

            var arrow = this._arrow = document.createElement("div");
            arrow.style.background = "url(http://map.baidu.com/fwmap/upload/r/map/fwmap/static/house/images/label.png) no-repeat";
            arrow.style.position = "absolute";
            arrow.style.width = "11px";
            arrow.style.height = "10px";
            arrow.style.top = parseInt(div.style.height, 10) + 2 * parseInt(div.style.padding, 10) + "px";
            arrow.style.left = "10px";
            arrow.style.overflow = "hidden";
            div.appendChild(arrow);

            map.getPanes().labelPane.appendChild(div);

            return div;
        }
        , draw: function () {
            var map = this._map;
            var pixel = map.pointToOverlayPixel(this._point);
            this._div.style.left = pixel.x - parseInt(this._arrow.style.left) + "px";
            this._div.style.top = pixel.y - 30 + "px";
        }
    }
});

function initMap(container,lng, lat, level) {
    map = new BMap.Map(container);
    map.addControl(new BMap.NavigationControl());
    map.addControl(new BMap.ScaleControl());
    var point = new BMap.Point(lng, lat);
    map.centerAndZoom(point, level);
    map.enableScrollWheelZoom();                  
    map.enableKeyboard();    
};

function MapLocation(arrInfo) {
    
    var div = $("<div id='locationContainer' style='position:absolute;left:0px;top:0px;border:0px;padding:0px;margin:0px;z-index:1000;overflow:hidden;width:100%;'></div>");
    div.height($(window).height());
    div.html("<div id='locationMap' style='width:100%;height:100%;' ></div>" +
    "<div id='locationClose' style='position:absolute;margin:2px;right:0px;top:0px;cursor:pointer;font-size:12px;background-color:white;width:60px;height:20px;padding:2px;border:1px solid blue;text-align:center'>关闭</div>").appendTo("body");
    setTimeout(function () {
        $("#locationClose").click(function () {
            $("#locationContainer").remove();
        });
        var map = new BMap.Map("locationMap");
        map.addControl(new BMap.NavigationControl());
        map.addControl(new BMap.ScaleControl());
        var point = new BMap.Point(arrInfo[0].lng, arrInfo[0].lat);
        map.centerAndZoom(point, 14);
        map.enableScrollWheelZoom();
        map.enableKeyboard();
        var points = [];
        $.each(arrInfo, function (i, v) {
            points.push(new BMap.Point(v.lng, v.lat)); 
            new MyOverlay(v.html, v.lng, v.lat, map);
        });
        map.setViewport(points);
    }, 500);    

    $(top).resize(function () {
        setTimeout(function () {
            if ($("#locationContainer").size() > 0) {
                $("#locationContainer,#locationMap").height($(window).height());
            }
        }, 500);
    });
}

